{% load i18n static simpletags %}
{% if result_hidden_fields %}
<div class="hiddenfields">{# DIV for HTML validation #}
    {% for item in result_hidden_fields %}{{ item }}{% endfor %}
</div>
{% endif %}
{#{% if results %}#}
<div class="results">
    <table id="result_list">
        <thead>
            <tr>
                {% for header in result_headers %}
                <th scope="col" {{ header.class_attrib }}>
                    {% if header.sortable %}
                    {% if header.sort_priority > 0 %}
                    <div class="sortoptions">
                        <a class="sortremove" href="{{ header.url_remove }}"
                            title="{% trans "Remove from sorting" %}"></a>
                        {% if num_sorted_fields > 1 %}<span class="sortpriority"
                            title="{% blocktrans with priority_number=header.sort_priority %}Sorting priority: {{ priority_number }}{% endblocktrans %}">{{ header.sort_priority }}</span>{% endif %}
                        <a href="{{ header.url_toggle }}"
                            class="toggle {% if header.ascending %}ascending{% else %}descending{% endif %}"
                            title="{% trans "Toggle sorting" %}"></a>
                    </div>
                    {% endif %}
                    {% endif %}
                    <div class="text">{% if header.sortable %}
                        <a href="{{ header.url_primary }}">{{ header.text|capfirst }}</a>{% else %}
                        <span>{{ header.text|capfirst }}</span>{% endif %}</div>
                    <div class="clear"></div>
                </th>{% endfor %}
            </tr>
        </thead>
        <tbody>
            {% for result in results %}
            {% if result.form.non_field_errors %}
            <tr>
                <td colspan="{{ result|length }}">{{ result.form.non_field_errors }}</td>
            </tr>
            {% endif %}
            <tr class="{% cycle 'row1' 'row2' %}">
                {% for item in result %}
                {{ item }}
                {% endfor %}
            </tr>
            {% endfor %}
        </tbody>
    </table>
    <script>
        $(function () {
            new Vue({
                el: "#result_list",
                data: {
                    centerDialogVisible: true
                },
                methods: {
                    closeReport: function (id) {
                        // this.$message('这是一条消息提示');
                        let that = this
                        $.post('/project/report_action/', { pk: id, action_type: 0 }, function (res) {
                            that.$alert('关闭成功！', '提示', {
                                confirmButtonText: '确定',
                                type: 'info',
                                callback: action => {
                                    window.location.reload()
                                }
                            });
                        }, 'json')
                    },
                    responseReport: function (id) {
                        let that = this
                        $.post('/project/report_action/', { pk: id, action_type: 1 }, function (res) {
                            that.$alert('响应成功！', '提示', {
                                confirmButtonText: '确定',
                                type: 'info',
                                callback: action => {
                                    window.location.reload()
                                }
                            });
                        }, 'json')
                    },
                    completeReport: function (id) {
                        let that = this
                        const inputFile = this.$refs.filElem.files[0];
                        if (inputFile) {
                            if (inputFile.type !== 'image/jpeg' && inputFile.type !== 'image/png' && inputFile.type !== 'image/gif') {
                                alert('不是有效的图片文件！');
                                return;
                            }
                            console.log()
                            var formData = new FormData();
                            formData.append("file", inputFile);
                            formData.append("pk", id);
                            formData.append("action_type", 2);

                            $.ajax({
                                url: '/project/report_action/',
                                dataType: 'json',
                                type: 'POST',
                                async: false,
                                data: formData,
                                processData: false, // 使数据不做处理
                                contentType: false, // 不要设置Content-Type请求头
                                success: function (data) {
                                    that.$alert('响应成功！', '提示', {
                                        confirmButtonText: '确定',
                                        type: 'info',
                                        callback: action => {
                                            window.location.reload()
                                        }
                                    });

                                },
                                error: function (response) {
                                    console.log(response)
                                    that.$alert(response, '错误提示', {
                                        confirmButtonText: '确定',
                                        type: 'error'
                                    });
                                }
                            });
                        }


                    }
                    ,
                    choiceImg: function () {
                        this.$refs.filElem.dispatchEvent(new MouseEvent('click'))
                    },
                    showImg: function (img) {
                        this.$alert('<div style="max-height:550px;overflow-x:scroll"><img src="' + img + '" style="width: 100%;height:100%"></div>', '预览图', {
                            dangerouslyUseHTMLString: true
                        });
                    },
                    showDescription: function (description) {
                        this.$alert(description, '缺陷描述');
                    }
                }
            })
        })
    </script>
</div>
{#{% endif %}#}